﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/BackSite.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    管理部门信息 
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="TablePlaceHolder" runat="server">

    <h2>departmentManage</h2>

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="TitlePlaceHolder" runat="server">
    <div id="title" style="background-image: url('../../Content/images/toolbar_bg.gif'); background-repeat: repeat-x">
        <span class="font16 fLeft" style="font-size: 26px"><strong>管理部门信息</strong></span><span class="fRight mR10 mT08"></span>
    </div>
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <script type="text/javascript">
        Ext.Loader.setPath('Ext.ux', '../../Components/ux');
        Ext.require([
            'Ext.grid.*',
            'Ext.data.*'
        ]);
        Ext.onReady(function () {

            Ext.define('MyData', {
                extend: 'Ext.data.Model',
                fields: ['active',
                    //第一个字段需要指定mapping，其他字段，可以省略掉。   
                     'Dep_ID',
                     'Dep_Name',
                     'ParentDep_ID'
                ]
            });
            //创建数据源   
            var store = Ext.create('Ext.data.Store', {
                model: 'MyData',
                pageSize: 16,
                remoteFilter: true,
                remoteSort: true,
                proxy: {
                    //异步获取数据，这里的URL可以改为任何动态页面，只要返回JSON数据即可   
                    type: 'ajax',
                    //url: 'DeptsQuery',
                    api: {
                        read: '../../Handlers/DeptOperation.ashx?act=read',
                        create: '../../Handlers/DeptOperation.ashx?act=add',
                        destroy: '../../Handlers/DeptOperation.ashx?act=del',
                        update: '../../Handlers/DeptOperation.ashx?act=edit'
                    },
                    reader: {
                        type: 'json',
                        root: 'data',
                        totalProperty: 'total'
                    },
                    writer: {
                        type: "json",
                        encode: true,//encode和root是配套使用的，只有设置了root时，encode才起作用
                        root: "data",//设置root的好处就是可通过习惯的方式在后台提取数据
                        allowSingle: false//不然还得判断提交数据是数组还是对象
                    }
                },
                autoLoad: true
            });

            //function button() {
            //    return '<input type="button" value="编辑" />';
            //}

            //创建Grid   
            var grid = Ext.create('Ext.grid.Panel', {
                store: store,
                selModel: { selType: "checkboxmodel", checkOnly: true, mode: "MULTI" },
                plugins: [{
                    ptype: "cellediting"
                }],
                columns: [
                    { xtype: 'rownumberer' },
                    //{ xtype: 'checkcolumn', text: '选择', dataIndex: 'active', checked: true, width: 100 },
                    { text: "部门ID", dataIndex: 'Dep_ID', sortable: false },
                    { text: "部门名称", flex: 1, width: 100, dataIndex: 'Dep_Name', sortable: true, field: { xtype: "textfield", allowBlank: false } },
                    { text: "上级部门ID", width: 100, dataIndex: 'ParentDep_ID', sortable: true, field: { xtype: "textfield", allowBlank: false } }
                    //{ text: "操作", width: 100, dataIndex: 'Address', renderer: button }
                ],
                dockedItems: [{
                    xtype: 'toolbar',
                    height: '50px',
                    items: [
                    //    {
                    //    text: '反选',
                    //    handler: selectOthers
                    //}, '-',
                    {
                        text: "增加", id: "add", icon: '../../Content/images/add.gif', handler: function () {
                            var grid = this.up("gridpanel");
                            var edit = grid.plugins[0];
                            var rec = new MyData({
                                Dep_ID: "fff"
                            });
                            edit.cancelEdit();
                            grid.store.insert(0, rec);
                            edit.startEditByPosition({ row: 0, column: 2 });
                        }
                    }, '-', {
                        text: '删除',
                        id: "delete",
                        icon: '../../Content/images/delete.gif',
                        disabled: true,
                        handler: function () {
                            var grid = this.up("gridpanel");
                            var rs = grid.getSelectionModel().getSelection();
                            if (rs.length > 0) {
                                Ext.Msg.confirm('提示', '确认删除？', function (btn) {
                                    if (btn == "yes") {
                                        this.store.remove(this.getSelectionModel().getSelection());
                                        store.sync();
                                    }
                                }, grid)
                            }
                        }
                    }, '-', {
                        itemId: 'save',
                        text: '保存',
                        id: "save",
                        icon: '../../Content/images/save.gif',
                        handler: function () {
                            store.sync();
                        }
                    }, '-', {
                        itemId: 'export',
                        text: '导出到Excel',
                        icon: '../../Content/images/application_go.png',
                        disabled: false,
                        handler: function () {
                            var selection = grid.getView().getSelectionModel().getSelection()[0];
                            if (selection) {
                                store.remove(selection);
                            }
                        }
                    }, '-',
                    {
                        xtype: 'exporterbutton',
                        store: store,
                        //                            //以下两项配置已在Buttion.js中配置默认路径 不需要重复指定， 有需要者可自行修改
                        swfpath: 'downloadify.swf',
                        //downloadImage: 'download.png',
                        //
                        //                            //这里可以根据当前表格指定导出的文件名
                        downloadName: '油水井管理系统错误日志Excel'
                    }]
                }],
                bbar: new Ext.PagingToolbar({
                    pageSize: 10,
                    store: store,
                    displayInfo: true,
                    displayMsg: '显示第{0}条到{1}条记录，一共{2}条',
                    emptyMsg: "没有记录"
                }),
                height: 500,
                width:600,
                x: 0,
                y: 0,
                title: '部门列表',
                renderTo: 'grid',
                viewConfig: {
                    stripeRows: true
                },
                listeners: {
                    selectionchange: function (view, rs) {
                        Ext.getCmp("delete").setDisabled(rs.length == 0);
                    }
                }
            })
            //创建Grid结束

            function selectOthers() {
                var testGrid = Ext.getCmp('grid');
                var records = testGrid.getStore().getRange();
                var selectModel = testGrid.getSelectionModel();
                for (var i = 0; i < records.length; i++) {
                    var record = records[i];
                    if (selectModel.isSelected(record)) {
                        selectModel.deselect(record);
                    } else {
                        selectModel.select(record, true);
                    }
                }
            }

            store.load({ params: { start: 0, limit: 10 } });

            function showDelMess() {
                Ext.MessageBox.confirm('提示', '确认删除？', doDel);
            }

            function doDel(btn) {
                if (btn == 'yes') {
                    var row = grid.getSelections();
                    var jsonData = "";
                    for (var i = 0, len = row.length; i < len; i++) {
                        var ss = row[i].get("ID");
                        jsonData = jsonData + ss + ",";
                    }
                    if (jsonData.length == 0) {
                        Ext.MessageBox.alert('提示', '删除失败！');
                    } else {
                        Ext.lib.Ajax.request(
                                    'GET',
                                    '../../Handlers/logMaster_Data.aspx?event=delete&delData=' + jsonData,
                                    {
                                        success: function (form, action) {
                                            Ext.MessageBox.alert('删除成功！');
                                            store.reload();
                                        },
                                        failure: function (form, action) {
                                            Ext.MessageBox.show({
                                                title: '提示',
                                                msg: '删除失败！',
                                                buttons: Ext.Msg.OK,
                                                icon: Ext.MessageBox.ERROR
                                            });
                                        }
                                    },
                                    null
                                );
                    }
                }
            }
        })
    </script>

    <div id="grid"></div>
</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="TableHeadPlaceHolder" runat="server">
</asp:Content>
